<template>
    <div class="appointment">
        <!-- 预约的列表 -->
        <appointmentTow
            ref="appointmentTow"
            v-show="page_i == 1"
            @getDetailFun="getDetailFun"
            @butFun="butFun"
            @actions="actions"
            @goAppointment="goAppointment"
        ></appointmentTow>
        <!-- 预约的详情 -->
        <appointmentThree
            ref="appointmentThree"
            v-show="page_show_i == 2"
            :is_back="false"
            @backFun="backFun"
            @upDataList="upDataList"
            @modificationFun="modificationFun"
        ></appointmentThree>
        <!-- 新建预约单 -->
        <appointmentAdd
            ref="appointmentAdd"
            v-show="page_show_i == 3"
            @backFun="backFun3"
            @upDataList="upDataList"
            :page_i="page_i"
            :page_show_i="page_show_i"
            :is_back="true"
        ></appointmentAdd>
        <!-- 预约排班 -->
        <appointmentScheduling
            ref="appointmentScheduling"
            v-show="page_i == 4"
            @backFun="backFun"
            :page_i="page_i"
        ></appointmentScheduling>
        <!-- 编辑排班 -->
        <appointmentEditService
            ref="appointmentEditService"
            v-show="page_i == 7"
            @backFun="backFun"
        ></appointmentEditService>
        <!-- 服务开单 -->
        <appointmentProjectBilling
            ref="appointmentProjectBilling"
            v-show="page_i == 5"
            @backFun="backFun"
            @submitScheduling="submitScheduling"
            :page_i="page_i"
        ></appointmentProjectBilling>
        <!-- 服务结算 -->
        <settlementPay
            ref="settlementPay"
            v-show="page_i == 6"
            :page_i="page_i"
            @backFun="backFun2"
            @successfulSettlement="successfulSettlement"
        ></settlementPay>
    </div>
</template>

<script>
import appointmentTow from "@/components/appointment/appointmentTow.vue";
import appointmentThree from "@/components/appointment/appointmentThree.vue";
import appointmentAdd from "@/components/appointment/appointmentAdd.vue";
import appointmentScheduling from "@/components/appointment/appointmentScheduling.vue";
import appointmentEditService from "@/components/appointment/appointmentEditService.vue";
import appointmentProjectBilling from "@/components/appointment/appointmentProjectBilling.vue";
import settlementPay from "@/components/appointment/settlementPay.vue";
import staticConst from "@/js/const/StaticConst.js";

export default {
    name: "appointment",
    components: {
        appointmentTow,
        appointmentThree,
        appointmentAdd,
        appointmentScheduling,
        appointmentEditService,
        appointmentProjectBilling,
        settlementPay,
    },
    data() {
        return {
            curPage: staticConst.YY_YY,
            page_i: 1,
            page_show_i: 1,
            operation_type: "",
            operation_data: {},
        };
    },
    onLoad(option) {
        this.operation_type = option.act;
        if (option.data) {
            this.operation_data = JSON.parse(option.data);
        }
    },

    mounted() {
        if (
            this.operation_type == 4 ||
            this.operation_type == 3 ||
            this.operation_type == 2 ||
            this.operation_type == 1
        ) {
            // 编辑草稿
            this.page_i = 5;
            this.page_show_i = 5;
            this.$refs.appointmentProjectBilling.initData();
        } else if (this.operation_type == 5) {
            // 去预约
            this.page_i = 3;
            this.page_show_i = 3;
            this.$refs.appointmentAdd.customerAppointment(this.operation_data);
        } else {
            this.$refs.appointmentTow.initData();
            // this.$refs.appointmentTow.getViewData();
        }
    },
    methods: {
        actions(data) {
            if (data.id) {
                if (data.isStaffid) {
                    this.page_i = 7;
                    this.$nextTick(() => {
                        this.$refs.appointmentEditService.initData(data);
                    });
                } else {
                    if (data.isFill) {
                        // this.page_i = 2;
                        this.page_show_i = 2;
                        const id = data.bookid;
                        this.$nextTick(() => {
                            this.$refs.appointmentThree.initData(id);
                        });
                    } else {
                        this.page_i = 3;
                        this.page_show_i = 3;
                        this.$nextTick(() => {
                            this.$refs.appointmentAdd.initData(data);
                        });
                    }
                }
            }
        },
        // 去预约
        goAppointment(data) {
            // 去预约
            // this.page_i = 3;
            this.page_show_i = 3;
            this.$refs.appointmentAdd.customerAppointment(data);
        },
        // 修改预约
        modificationFun(data) {
            // this.page_i = 3;
            this.page_show_i = 3;
            this.$nextTick(() => {
                this.$refs.appointmentAdd.modificationFun(data);
            });
        },
        // 点击首页下方3个按钮
        butFun(type) {
            if (type == 1) {
                this.page_i = 5;
                this.page_show_i = 5;
                this.$refs.appointmentProjectBilling.initData();
            } else if (type == 2) {
                this.page_i = 3;
                this.page_show_i = 3;
                this.$refs.appointmentAdd.initData();
            } else {
                this.page_i = 4;
                this.$refs.appointmentScheduling.initData();
            }
        },
        //结算成功
        successfulSettlement(data) {
            this.page_i = 5;
            this.page_show_i = 5;
            this.$refs.appointmentProjectBilling.successfulSettlement(data);
        },
        // 结算页面
        submitScheduling(data) {
            this.page_i = 6;
            this.$refs.settlementPay.initData(data);
        },
        // 编辑页面返回返回
        backFun3(isEdit, id) {
            if (isEdit) {
                // this.page_i = 2;
                this.page_show_i = 2;
                this.$refs.appointmentThree.initData(id);
            } else {
                this.backFun();
            }
        },
        // 结算页面返回
        backFun2() {
            this.page_i = 5;
            this.page_show_i = 5;
            this.$refs.appointmentProjectBilling.initData();
        },
        // 返回首页
        backFun() {
            if (this.operation_type) {
                uni.navigateTo({
                    url: `/pages/appointment/index`,
                });
                return;
            }
            if (this.$refs.appointmentTow.is_type) {
                this.$refs.appointmentTow.openDialog();
            }
            this.page_i = 1;
            this.$refs.appointmentTow.getViewData();
        },
        upDataList() {
            this.$refs.appointmentTow.emptyListData();
            this.$refs.appointmentTow.handlecheTab(true);
        },
        getDetailFun(id) {
            // this.page_i = 2;
            this.page_show_i = 2;
            this.$refs.appointmentThree.initData(id);
        },
    },
};
</script>

<style lang="scss" scoped>
.appointment {
    display: flex;
    justify-content: flex-start;
    min-width: 820px;
    height: 100%;
    position: relative;
}
</style>